<?php
	$linkprint = $this->getUrl('')."pos/index/index";
	$order = Mage::getSingleton('core/session')->getOrderPrint();

?>
<script type="text/javascript">
	jQuery(document).ready(function(){
		// jQuery.fn.colorbox({width:"50%", height:"50%",  href:"#old_order" ,onLoad: function() {
			// jQuery('#cboxClose').remove();
		// }});
		//jQuery.colorbox({iframe:true, innerWidth:425, innerHeight:344,href:"<?php echo $linkprint?>"});
	});
</script>

<?php ?>
<div class="content-header">
<table cellspacing="0">
    <tr>
        <td><h3><?php echo Mage::helper('pos')->__('Point Of Sale Manager') ?></h3></td>
    </tr>
</table>
</div>
<script type="text/javascript">	
	
	
	var shippingMethodAjaxUrl = '<?php echo Mage::helper('adminhtml')->getUrl('*/pos_order/shippingmethod/');?>';
	var defaultShippingMethod = 'flatrate';
	var addProductFromBarcodeUrl = '<?php echo Mage::helper('adminhtml')->getUrl('*/pos_order/barcode', array('_query' => 'isAjax=true'));?>';
	var currency = '<?php echo Mage::app()->getLocale()->currency(Mage::app()->getStore()->getCurrentCurrencyCode())->getSymbol();?>';
	var closeModaleWindow = 'Close';
	var skinUrl = '<?php echo $this->getSkinUrl('images/gt_pos/')?>';
	var formKey = '<?php echo $this->getFormKey() ?>';
</script> 
<form id="form_one" action="<?php echo Mage::helper('adminhtml')->getUrl('pos/dev_dev/index/');?>" method="POST" name="form_one" enctype="multipart/form-data" target="blank">
	<input name="form_key" type="hidden" value="<?php echo Mage::getSingleton('core/session')->getFormKey() ?>" />
	<input id="product_ids" type="hidden" value="" name="product_ids">
	<input id="customer_id" type="hidden" value="26" name="customer_id">
	<table width="100%" cellspacing="4" border="0">	
		<tbody>
			<tr>
				<td>
					<div class="entry-edit">
						<div class="entry-edit-head">
							<h4 class="icon-head head-edit-form fieldset-legend">Products</h4>
						</div>
						<fieldset>
							<div class="grid">
								<table width="100%" cellspacing="0" name="tbl_products" id="tbl_products" class="data">
									<colgroup>
										<col width="40"/>
										<col/>
										<col width="90"/>
										<col width="90"/>
										<col width="100"/>
										<col width="90"/>
										<col width="120"/>
										<col/>
									</colgroup>
									<thead>
										<tr class="headings">
											<th class="a-center">S/N</th>
											<th class="a-center">Product</th>
											<th class="a-center">Status</th>
											<th class="a-center">Qty</th>
											<th class="a-center">Price </th>
											<th class="a-center">Tier Price</th>												
											<th class="a-center">&nbsp;</th>
										</tr>
									</thead>
									<tbody>

									</tbody>
								</table>
							</div>
							<div id="div_selected_products">

							</div>
						</fieldset>
					</div>
					<script type="text/javascript">
						jQuery(document).ready(function(){
							jQuery('.click_chose_product').click(function(){								
								var abc = 1;
								var stri = "";
								var stri2="";								
								
								var xyz = jQuery(this).next();
								var temp = '.pos_col_tier_'+xyz.attr('class');
								
								if(!jQuery(temp).attr('name')){
									xyz.find('input').each(function(i){
										if(jQuery(this).attr('id') == 'tierp_'+abc){										
											stri = "<span class='tierp'>"+jQuery(this).val()+"</span>";											
											stri2 = "Qty:<span class='qty_of_tier'>"+parseInt(jQuery(this).next().val())+"</span>";										
											var clasname = '.pos_' + jQuery(this).attr('class');
											jQuery(clasname).append("<p class='tier_price'>"+stri2+"="+stri+"</p>");										
											abc++;
											jQuery(clasname).attr('name','edited');
										}	
									});		
								}	
							});
						});
					</script>
					<?php echo $this->getChildHtml('pos_order_promotions')?>

					<script>
						jQuery(document).ready(function() {
							jQuery("#action_tabs").tabs();
						});
					</script>
					

					<div id="action_tabs">				
						<ul class="tabs-horiz" >
							<li><a class="tab-item-link " title="Add products" id="add_products_tab" href="#tab_add_products_tab">Add products</a></li>
							<li><a class="tab-item-link " title="Customer information" id="customer_information_tab" href="#tab_customer_information_tab">Customer information</a></li>
							<li><a class="tab-item-link " title="Customer address" id="customer_address_tab" href="#tab_customer_address_tab">Customer address</a></li>
							<li><a class="tab-item-link " title="Comments" id="comments_tab" href="#tab_comments_tab">Comments</a></li>
						</ul>				
						<div id="tab_add_products_tab" class="entry-edit visible-menu">
							<div class="entry-edit-head">
								<h4 class="icon-head head-edit-form fieldset-legend">Add product</h4>
							</div>
							
							<!-- print product grid -->
							<?php echo $this->getChildHtml('productGrid');?> 
						</div>
						
						<div id="tab_customer_information_tab" class="entry-edit hidden-menu">
							<div class="entry-edit-head">
								<h4 class="icon-head head-edit-form fieldset-legend">Customer</h4>
							</div>
							<fieldset>
								<input type="radio" name="customer[mode]" id="customer_mode_guest" value="guest" onclick="setCustomerMode('guest');" checked="checked">
								<label for="customer_mode_guest">
									Guest
								</label>
								&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
								<input type="radio" name="customer[mode]" id="customer_mode_new" value="new" onclick="setCustomerMode('new');">
								<label for="customer_mode_new">
									New customer
								</label>
								&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 
								<input type="radio" name="customer[mode]" id="customer_mode_existing" value="existing" onclick="setCustomerMode('existing');">
								<label for="customer_mode_existing">
									Existing customer
								</label>
								<script type="text/javascript">
									jQuery(document).ready(function(){
										jQuery('#customer_mode_guest').click(function(){
											jQuery('#now_customer').html('Customer : guest guest<br/> Group : General<input type="hidden" name="customer_group" id="customer_group" value="1">');
											jQuery('#customer_id').val(3);
											jQuery('#div_cust_new').css('display','none');
											jQuery('#div_cust_existing').css('display','none');
										});
										jQuery('#customer_mode_new').click(function(){
											jQuery('#div_cust_new').css('display','block');
											jQuery('#div_cust_existing').css('display','none');
										});
										jQuery('#customer_mode_existing').click(function(){
											jQuery('#div_cust_new').css('display','none');
											jQuery('#div_cust_existing').css('display','block');
										});
									});
								</script>
								<div id="div_cust_new" class="div_cust_hidden">									 
									<table>
										<tbody>
											<tr>
												<td width="130">
													<b>
														Email
													</b>
												</td>
												<td>
													<input type="input-text validate-email required-entry" value="" id="customer_email" name="order[account][email]">
												</td>
											</tr>
											<tr>
												<td>
													<b>
														Firstname
													</b>
												</td>
												<td>
													<input type="input-text required-entry" value="" id="customer_firstname" name="order[billing_address][firstname]">
												</td>
											</tr>
											<tr>
												<td>
													<b>
														Lastname
													</b>
												</td>
												<td>
													<input type="input-text required-entry" value="" id="customer_lastname" name="order[billing_address][lastname]">
												</td>
											</tr>											
											<tr>
												<td>
													<b>
														Real ID
													</b>
												</td>
												<td>
													<input type="input-text required-entry" value="" id="customer_read_id" name="customer_read_id">
												</td>
											</tr>
											<tr>
												<td>
													<b>
														Default Password
													</b>
												</td>
												<td>
													<b>123567890</b>
												</td>
											</tr>
											<tr>
												<td>
													<a id="register_customer" title="register_customer" href="#"  class="button" ><span>Register Customer</span></a>
												</td>												
											</tr>
										</tbody>
									</table>
								
									<script type="text/javascript">
										
										jQuery(document).ready(function() {			
											jQuery('#register_customer').click(function() {
												var cus_email = jQuery.trim(jQuery('#customer_email').val());
												var cus_fir = jQuery.trim(jQuery('#customer_firstname').val());
												var cus_las = jQuery.trim(jQuery('#customer_lastname').val());
												var cus_real = jQuery.trim(jQuery('#customer_read_id').val());
												if(cus_email != '' && cus_fir != '' && cus_las != '' && cus_real != ''){
													jQuery.ajax({
														url: "http://vn.gentotech.net/pub/pos/index.php/admin/pos_order/addnewcustomer?isAjax=true",
														type: "POST",
														data: 'email=' + cus_email +'&fisrt='+cus_fir +'&last='+cus_las+'&real='+cus_real+'&form_key='+ '<?php echo $this->getFormKey() ?>',
														dataType: 'json',					
														success: function(data) {
															clickCustomer(data.id,data.name,data.groupid,data.groupname);
															//alert('done');
														},
														error: function (response) {
															alert('Invalid customer!');
														}
													});
												}else{
													alert('Please input customer info');
												}											
											});
										});
									</script>
									
								</div>
								<div id="div_cust_existing" class="div_cust_hidden">
									<!-- print customer grid -->
									<?php echo $this->getChildHtml('customerGrid');?> 
								</div>
								<div id="div_selected_customer" class="div_cust_hidden">
								</div>
							</fieldset>
							<div class="entry-edit-head">
								<h4 class="icon-head head-edit-form fieldset-legend">Newsletter subscription</h4>
							</div>
							<fieldset>
								<table>
									<tbody><tr>
										<td>
											<label for="newsletter">Subscribe to newsletter</label>
										</td>
										<td>
											<input type="checkbox" id="newsletter" name="newsletter" disabled="">
										</td>
									</tr>
								</tbody></table>
							</fieldset>
						</div>	

						<div id="tab_customer_address_tab" class="entry-edit hidden-menu">
							<div class="entry-edit-head">
								<h4 class="icon-head head-edit-form fieldset-legend">
									Address
								</h4>
							</div>
							<fieldset>
								<div id="cust_display" class="div_cust_display">
									<table>
										<tbody>
											<tr>
												<td width="130">
													<b>
														Address
													</b>
												</td>
												<td>
													<input type="text" value="" id="address" name="order[billing_address][street][0]" size="50">
												</td>
											</tr>
											<tr>
												<td>
													<b>
														City
													</b>
												</td>
												<td>
													<input type="text" value="" id="city" name="order[billing_address][city]" size="50">
												</td>
											</tr>
											<tr>
												<td>
													<b>
														Zip
													</b>
												</td>
												<td>
													<input type="text" value="" id="zip" name="order[billing_address][postcode]" size="50">
												</td>
											</tr>
											<tr>
												<td>
													<b>
														Region
													</b>
												</td>
												<td>
													<input type="text" name="order[billing_address][region]">
												</td>
											</tr>
											<tr>
												<td>
													<b>
														Country
													</b>
												</td>
												<td>
													<input type="hidden" value="SG" id="country" name="order[billing_address][country_id]">
													Singapore
												</td>
											</tr>											
											<tr>
												<td>
													<b>
														Phone
													</b>
												</td>
												<td>
													<input type="text" value="" id="phone" name="order[billing_address][telephone]" size="50">
												</td>
											</tr>
											<tr>
												<td>
													<b>
														Fax
													</b>
												</td>
												<td>
													<input type="text" value="" id="fax" name="order[billing_address][fax]" size="50">
												</td>
											</tr>
										</tbody>
									</table>
								</div>
							</fieldset>
							
						</div>	
						
						<div id="tab_comments_tab" class="entry-edit hidden-menu">
							<div class="entry-edit-head">
							<h4 class="icon-head head-edit-form fieldset-legend">
								Comments
							</h4>
						</div>
						<fieldset>
							<table border="0">
								<tbody>
									<tr>
										<td class="label">
											Order comments
										</td>
										<td class="value">
											<textarea rows="5" cols="80" id="comments" name="comment"></textarea>
										</td>
									</tr>
									<tr>
										<td class="label">
											Invoice comments
										</td>
										<td class="value">
											<textarea rows="5" cols="80" id="invoice_comments" name="invoice_comments"></textarea>
										</td>
									</tr>
								</tbody>
							</table>
						</fieldset>
						</div>					
					</div>								
				</td>
				<td width="300">
					<div class="entry-edit" >
						<div class="entry-edit-head">
							<h4 class="icon-head head-edit-form fieldset-legend">
								Shopping Bag
							</h4>
						</div>
						<fieldset id="shopping_bag">
							<center>
								<h1>
									SGD
									<span id="div_total">
										$0.00
									</span>									
								</h1>
							</center>
							<p style="border-top: 1px solid #D6D6D6"></p>
							<p align="left" id="now_customer">
								Customer : guest guest
								<br> Group : General
								<input type="hidden" name="customer_group" id="customer_group" value="1">							
							</p>
							
						</fieldset>
					</div>		

					<div class="entry-edit">
						<div class="entry-edit-head">
							<h4 class="icon-head head-edit-form fieldset-legend">
								Product Info
							</h4>
						</div>
						<fieldset id="col_right_product_info">
							
						</fieldset>
					</div>
					
					<div class="entry-edit">
						<div class="entry-edit-head">
							<h4 class="icon-head head-edit-form fieldset-legend">
								Payment Method
							</h4>
						</div>
						<fieldset>
							<center>
								<img id="img_payment_ccsave" name="img_payment_ccsave" onclick="selectPaymentMethod('ccsave')" class="payment_method" src="<?php echo $this->getSkinUrl('images/gt_pos/BankTerminal.png') ?>">
								<img id="img_payment_cashondelivery" name="img_payment_cashondelivery" onclick="selectPaymentMethod('cashondelivery')" class="payment_method" src="<?php echo $this->getSkinUrl('images/gt_pos/Check.png') ?>">
								<img id="img_payment_checkmo" name="img_payment_checkmo" onclick="selectPaymentMethod('checkmo')" class="payment_method_selected" src="<?php echo $this->getSkinUrl('images/gt_pos/Money.png') ?>">
								<input type="hidden" value="checkmo" id="paymentmethod" name="payment[method]">
								<p>
									<input type="checkbox" checked="" value="1" id="is_paid" name="is_paid">
									Create invoice
								</p>
							</center>
						</fieldset>
					</div>
					
					<div class="entry-edit">
						<div class="entry-edit-head">
								<h4 class="icon-head head-edit-form fieldset-legend">Shipping Method</h4>
						</div>
						<fieldset>
							<center>
								<div id="div_shipping_methods">
									<?php 
										// shipment method
										// $methods = Mage::getSingleton('shipping/config')->getActiveCarriers();
										// foreach($methods as $key=>$value){
											// var_dump($key);
											// var_dump($value);
										// }

									?> 
									<div id="span_shipping_method_flatrate_flatrate" class="span_shipping_method_label_selected" onclick="selectShippingMethod('flatrate_flatrate');">Flat Rate</div>
									<div id="span_shipping_method_freeshipping_freeshipping" class="span_shipping_method_label" onclick="selectShippingMethod('freeshipping_freeshipping');">Free Shipping</div>
									<input id="shippingmethod" type="hidden" value="flatrate_flatrate" name="shipping_method">
								</div>									
							</center>
						</fieldset>
					</div>				
					
					<div class="entry-edit">
						<div class="entry-edit-head">
								<h4 class="icon-head head-edit-form fieldset-legend">Place order</h4>
						</div>
							<fieldset>
								<center>
									<h4>Payment Method: <span id="order_payment_method">Money</span></h4>
									<h4>Order Total: <span id="order_total">$0.00</span></h4>
									<h4>Amount Received: <span id="order_amount_received">$0.00</span></h4>
									<h4>Change: <span id="order_change" style="color : red;">$0.00</span></h4>
									<button type="button" class="scalable" onclick="ShowChangeCalculator(document.getElementById('div_total').innerHTML);"><span>Calculate change</span></button>&nbsp;
								   <button type="button" class="scalable save" onclick="editForm.submit()"><span>Create Order</span></button>
								</center>
							</fieldset>
							
					</div>
				</td>
			</tr>
	</table>
</form>
<script type="text/javascript"> 

	//Init scanner
	// document.onkeypress = handleKey; 
	// enableCatchKeys(null, 'addProductFromBarcode();');

</script>
<script type="text/javascript">
    var editForm = new varienForm('form_one', '');
</script>
<div id="change_calculator" style="display:none">
	<div class="entry-edit">
		<div class="entry-edit-head">
			<h4 class="icon-head head-account">Change calculator</h4>
		</div>
		<div class="fieldset">
			<div class="hor-scroll">
				<table cellspacing="0" class="form-list">
				<tr>
					<td class="label"><h2>Order total</h2></td>
					<td><div id="cc_order_total" name="cc_order_total" style="font-size: 24px; text-align: right; width: 320px; margin-top: 10px; font-weight: bold;"></div></td>
				</tr>
				<tr>
					<td class="label"><h2>Given amount</h2></td>
					<td align="right">
						<div name="cc_given_amount" style="font-size: 24px; text-align: right; width: 320px; margin-top: 10px; font-weight: bold;">
							<span>$ </span><input id="cc_given_amount" onkeyup="calculateChange()" type="text" value="0.00" style="font-size: 24px; text-align: right; width: 170px; font-weight: bold;"/>
						</div>
					</td> 
				</tr>
				<tr>
					<td class="label">
						<h2>Change </h2>
					</td>
					<td><div id="cc_change" name="cc_change" style="font-size: 24px; text-align: right; width: 320px; margin-top: 10px; font-weight: bold; color:red;"></div></td>
				</tr>
				</table>
				<p>&nbsp;</p>
				<table cellspacing="0" width="100%">
					<tr>
						<td width="20%" align="center"><input type="button" value=" + 500 " onclick="addAmount(500)" style="font-size: 20px;"><br>&nbsp;</td>
						<td width="20%" align="center"><input type="button" value=" + 200 " onclick="addAmount(200)" style="font-size: 20px;"></td>
						<td width="20%" align="center"><input type="button" value=" + 100 " onclick="addAmount(100)" style="font-size: 20px;"></td>
						<td width="20%" align="center"><input type="button" value=" + 50 " onclick="addAmount(50)" style="font-size: 20px;"></td>
						<td width="20%" align="center"><input type="button" value=" + 20 " onclick="addAmount(20)" style="font-size: 20px;"></td>
					</tr>
					<tr>
						<td width="20%" align="center"><input type="button" value=" + 10 " onclick="addAmount(10)" style="font-size: 20px;"><br>&nbsp;</td>
						<td width="20%" align="center"><input type="button" value=" + 5 " onclick="addAmount(5)" style="font-size: 20px;"></td>
						<td width="20%" align="center"><input type="button" value=" + 2 " onclick="addAmount(2)" style="font-size: 20px;"></td>
						<td width="20%" align="center"><input type="button" value=" + 1 " onclick="addAmount(1)" style="font-size: 20px;"></td>
						<td width="20%" align="center"><input type="button" value=" + 0.5 " onclick="addAmount(0.5)" style="font-size: 20px;"></td>
					</tr>
					<tr>
						<td width="20%" align="center"><input type="button" value=" + 0.2 " onclick="addAmount(0.2)" style="font-size: 20px;"><br>&nbsp;</td>
						<td width="20%" align="center"><input type="button" value=" + 0.1 " onclick="addAmount(0.1)" style="font-size: 20px;"></td>
						<td width="20%" align="center"><input type="button" value=" + 0.05 " onclick="addAmount(0.05)" style="font-size: 20px;"></td>
						<td width="20%" align="center"><input type="button" value=" + 0.02 " onclick="addAmount(0.02)" style="font-size: 20px;"></td>
						<td width="20%" align="center"><input type="button" value=" + 0.01 " onclick="addAmount(0.01)" style="font-size: 20px;"></td>
					</tr>
					<tr>
						<td align="center" colspan="5">
							<input type="button" value=" Reset " onclick="resetAmount()" style="font-size: 20px;">
						</td>
				</table>
			</div>
		</div>
	</div>
</div>
